<template>
    <div class="table">
        <div class="crumbs">
            <el-breadcrumb separator="/">
                <el-breadcrumb-item><i class="el-icon-tickets"></i> 赛事管理</el-breadcrumb-item>
            </el-breadcrumb>
        </div>
        <div class="container">
            <div class="handle-box">
                <el-button type="primary" icon="delete" class="handle-del mr10" @click="addCompetition">新增赛事</el-button>
                <el-input v-model.trim="select_word" placeholder="筛选关键词" class="handle-input mr10"></el-input>
                <el-button type="primary" icon="search" @click="search">搜索</el-button>
            </div>
            <el-table :data="data" border style="width: 100%" ref="multipleTable" >
                <el-table-column prop="matchName" label="赛事名称"  >
                </el-table-column>
                <!-- <el-table-column prop="competition_session" label="比赛场次"  >
                </el-table-column> -->
                <el-table-column prop="signFee" label="费用" >
                </el-table-column>
                <el-table-column prop="bonusAmount" label="总奖金" >
                </el-table-column>
                <el-table-column prop="matchStartTime" label="比赛开始时间">
                </el-table-column>
                <el-table-column prop="matchEndTime" label="比赛结束时间" >
                </el-table-column>
                <el-table-column label="操作" width="300">
                    <template slot-scope="scope">
                        <el-button size="small" type="primary" @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
                        <el-button size="small" type="success" @click="handleLook(scope.$index, scope.row)">查看</el-button>
                        <el-button size="small" type="danger" @click="handleDelete(scope.$index, scope.row)">删除</el-button>
                        <el-button size="small" type="warning" disabled="disabled"  v-if="scope.row.matchStatus == 2">已发布</el-button>
                        <el-button size="small" type="warning" @click="handlePublish(scope.$index, scope.row)" v-else-if='scope.row.matchStatus == 1'>发布</el-button>
                    </template>
                </el-table-column>
            </el-table>
            <div class="pagination">
                <div class="block">
    <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page.sync="currentPage1" :page-size="10"  layout="total, prev, pager, next"
      :total="totalCount" >
    </el-pagination>
  </div>
            </div>
        </div>


    </div>
</template>

<script>
export default {
  name: "app",
  data() {
    return {
      select_word: "", //筛选关键词
      totalCount: 0,
      currentPage1: 1, //当前页
      data: [] //数据列表
    };
  },
  created() {
    this.initData();
  },
  methods: {
    //初始化
    async initData(pageNo) {
      let res = await this.$post({
        url: this.fn.chatApi + "/admin/match/getMatchList",
        data: {
          pageNo: pageNo || 1 ,
          pageSize: 10
        }
      });
      if (res.code == 111111) {
        this.data = res.data.dataList;
        this.totalCount = res.data.totalCount;
      }else{
        this.$message({
          type:"error",
          message:'请求失败哦'
        })
      }
    },
    //新增赛事
    addCompetition() {
      this.$router.push("/addCompetition");
    },
    //搜索
    async search() {
      let res = await this.$post({
        url: this.fn.chatApi + "/admin/match/getMatchList",
        data: {
          matchName:this.select_word,
          pageNo: 1 ,
          pageSize: 10
        }
      });
      if (res.code == 111111) {
        this.data = res.data.dataList;
        this.totalCount = res.data.totalCount;
      }else{
        this.$message({
          type:"error",
          message:'请求失败哦'
        })
      }
    },
    //分页
    handleCurrentChange(val) {
      this.initData(val)
    },
    handleSizeChange(val) {
    },
    //删除
    async handleDelete(index,row){
      let res = await this.$get({
        url: this.fn.chatApi + "/admin/match/deleteMatch",
        data: {
         macthId:row.matchId
        }
      });
      if(res.code == 200118){
          this.$message({
          message: res.message,
          type: 'warning'
        });
      }else if(res.code == 111111){
        this.$message({
          message: '删除成功',
          type: 'success'
        });
        this.initData()
      }
    },
    //发布
    async handlePublish(index,row){
      let res = await this.$get({
        url: this.fn.chatApi + "/admin/match/releaseOnline",
        data: {
         macthId:row.matchId
        }
      });
      if(res.code == 111111){
         this.$message('发布成功');
         this.initData()
      }else{
         this.$message({
           type:'error',
           message:res.message
         });
      }
    },
    //查看
    async handleLook(index,row){
      this.$router.push({path:'/matchDetails',query:{matchId:row.matchId}})
    },
    //编辑
    handleEdit(index,row){
       this.$router.push({path:'/matchEdit',query:{matchId:row.matchId}})
    }
    
  }
};
</script>

<style scoped>
.handle-box {
  margin-bottom: 20px;
}

.handle-select {
  width: 120px;
}

.handle-input {
  width: 300px;
  display: inline-block;
}
.del-dialog-cnt {
  font-size: 16px;
  text-align: center;
}
</style>
